.px2rem(@name, @px){
    @{name}: @px / 75 * 1rem;
}

@back: white;
body{
    background-color: #ececec;
    .search{
        background: @back;
        .px2rem(height, 80);
        a{
            height: 100%;
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
        }
    }
    .header{
        img{
            width: 100%;
            .px2rem(height, 300);
        }
    }
    .flash{
        .px2rem(height, 300);
        background: @back;
        .px2rem(margin-top, 21);
        display: flex;
        position: relative;
        .left{
            background: url("https://wap.ghs.net/public/images/37/cb/ae/ac918204e929e1861e6f15aa2008b5a8995fd853.jpg") center center / contain no-repeat;            
            flex: 1;
            border-right: #ececec solid 2px;
            position: relative;
            a{
                height: 100%;
                width: 100%;
                
                h3{
                    .px2rem(font-size, 30);
                    .px2rem(margin-top, 20);
                    color: #d0011b;
                    text-align: center;
                    img{
                        .px2rem(height, 18);
                        .px2rem(margin-top, 25);
                    }
                }
                .countdown{
                    .px2rem(height, 40);
                    .px2rem(line-height, 40);
                    display: flex;
                    justify-content: center;
                    .px2rem(font-size, 40);
                    font-weight: bold;
                    div{
                        background: black;
                        height: 100%;
                        .px2rem(width, 50);
                        color: white;
                        .px2rem(margin, 6);
                        text-align: center;
                        .px2rem(font-size, 28);
                    }
                }
                .bottom{
                    position: absolute;
                    bottom: 0;
                    left: 0;
                    width: 60%;
                }
                .price{
                    .px2rem(width, 82);
                    .px2rem(height, 82);
                    .px2rem(line-height, 82);
                    .px2rem(font-size, 24);
                    color: white;
                    background-color: #dd2526;
                    text-align: center;
                    font-weight: bolder;
                    border-radius: 50%;
                    position: absolute;
                    top: 60%;
                    right: 10%;
                }
            }
        }
        .right{
            flex: 1;
            display: flex;
            flex-direction: column;
            .top{
                flex: 1;           
                background: url("https://wap.ghs.net/public/images/83/78/45/0f8bf78e8d540455e5d1e43574d5c4603e1b38e2.jpg") center center / contain no-repeat;

            }
            .bottom{
                flex: 1;
                background: url("https://wap.ghs.net/public/images/af/58/93/179d0cda41a7125f578e726274b9ff8b4ad158d6.jpg") center center / contain no-repeat;
            }
        }
    }
}

.rob{
    .px2rem(height, 356);
    background-color: white;
    .px2rem(margin-top, 21);
    .top{
        .px2rem(height, 54);
        .px2rem(line-height, 48);
        padding:0 3%;
        span:nth-child(2){
            float: right;
        }
    }
    .rob_bot{
        .px2rem(height, 302);
        position: relative;
        padding-top: 10%;
        .slide{
            .px2rem(width, 8147);
            height: 80%;
            img{
                width: 100%;
                height: 100%;
            }
        }
    }
}

.mustbuy{
    .px2rem(margin-top, 21);
    .px2rem(height, 1224);
    .top{
        .px2rem(height, 80);
         width: 100%; 
    }
    a{
        .box{
            box-shadow: 1px 1px 1px #ccc inset;
            background-color: @back;
            .px2rem(height, 285);
            width: 50%;
            position: relative;
            .px2rem(font-siz2, 24);
            float: left;
            p{
                text-align: center;
                .px2rem(line-heigth, 34);
            }
            .discount{
                background: #dd2526;
                .px2rem(height, 70);
                .px2rem(line-height, 70);
                .px2rem(width, 70);
                position: absolute;
                .px2rem(top,20);
                .px2rem(left, 25);
                border-radius: 50%;
                color: white;
                text-align: center;
            }
            img{
                .px2rem(height, 120);
                .px2rem(width, 180);
                position: relative;
                left: 50%;
                .px2rem(margin-left, -90);
            }
            .price{
                color: #7f1084;
                s{
                    .px2rem(font-size, 16);
                }
            }
        }
    }
    .clear{
        clear: both;
    }
}

.ad{
    .px2rem(margin-top, 21);
    .px2rem(margin-bottom, 88);
    .top{
        .px2rem(height, 80);
        width: 100%; 
    }
    .box{
        .px2rem(height, 510);
        .px2rem(margin-bottom, 20);
        .px2rem(padding-top, 185);
        background: url(" https://pic.ghs.net/public/images/a2/16/1c/f6f69b9c372b4039eeecd5854b4f02bf9253c331.jpg")100% 100%;
        color: white;
        text-align: center;
        h3{
            .px2rem(font-szie, 62);
        }
        h4,p{
            .px2rem(font-szie, 30);
            .px2rem(margin-top, 42);
        }
        p{
            .price_flag{
                border: 1px solid white;
            }
        }
    }
    .box:nth-child(3){
        background: url("https://pic.ghs.net/public/images/05/1d/51/2a4cc1f456963f0a1bb8b4d732a1a29af19b92ee.jpg") 100% 100%;
    }
    .box:nth-child(4){
        background: url("https://pic.ghs.net/public/images/a2/ac/dd/a44988bf8ce45c6a6412877734910040bbd6b7a5.jpg") 100% 100%;
    }
    .box:nth-child(5){
        background: url("https://pic.ghs.net/public/images/16/c9/17/3b880cb62321ba58db977381b1d37b6334e8f178.jpg") 100% 100%;
    }
}

.footer{
    .px2rem(height, 88);
    background-color: white;
    position: fixed;
    bottom: 0;
    display: flex;
    width: 100%;
    a{
        flex: 1;
        dl{
            dt{
                display: flex;
                justify-content: center;
                .px2rem(height, 60);
                align-items: center;
            }
            dd{
                text-align: center;
            }
        }
    }
}